<template>
  <BasicModal :show="show" title="新增维护记录" width="30%" :widthComfirm="true" @comfirm="comfirm">
    <template #content>
      <div class="progress">
        <div class="title">应聘进度：</div>
        <div class="desc">{{ store.currentResume.processDetail }}</div>
      </div>
      <a-form ref="formRef" :model="form" :rules="rules" :label-col="{ style: { width: '100px', textAlign: 'right' } }">
        <a-form-item label="应聘者状态" name="status">
          <a-select v-model:value="form.status" :filter-option="filterOption" show-search>
            <a-select-option :value="item.value" v-for="item in statusList" :key="item.label">{{ item.label
              }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="维护记录" name="record">
          <a-textarea v-model:value="form.record" showCount :maxlength="500"  />
        </a-form-item>
      </a-form>
    </template>

  </BasicModal>
</template>

<script setup lang='ts'>
import { ref, defineEmits } from "vue"
import type { Rule } from 'ant-design-vue/es/form';
import BasicModal from "./BasicModal.vue";
const show = ref<boolean>(false);
import { message } from "ant-design-vue";
import { addRecord } from "@/api/application-details/index.ts";
import { comStores } from '@/store/common/comStore';
const store = comStores()

const { userName } = store.userInFor
const form = ref({
  status: "",
  record: ""
})
const rules: Record<string, Rule[]> = {
  record: [{ required: true, message: '请输入维护记录', trigger: 'change' }],
  status: [{ required: true, message: '请选择应聘者状态', trigger: 'change' }],
};

const statusList = ref<{ label: string; value: string }[]>([
  { label: "很好", value: "很好" },
  { label: "较好", value: "较好" },
  { label: "一般", value: "一般" },
  { label: "较差", value: "较差" },
  { label: "很差", value: "很差" },
]);
const formRef = ref<any>(null)
const emits = defineEmits(['notice'])
const filterOption = (input: string, option: any) => {
  return option.key.toLowerCase().indexOf(input.toLowerCase()) >= 0;
};
const comfirm = async () => {
  const res = await formRef.value.validate();

  if (!res) return;
  const { resumeId, processId, processDetail } = store.currentResume;
  // formRef.value.resetFields();
  let param = {
    resumesId: resumeId,
    processStatus: processDetail,
    status: form.value.status,
    content: form.value.record,
    operator: userName
  }
  const data = await addRecord(param);
  if (data && data.code === '10000') {
    show.value = false;
    store.getResumeInfo(resumeId);
    message.success('操作成功');
    form.value.record = "";
    form.value.status = ""
    emits('notice')
  } else {
    message.error(data.msg);
  }
}
defineExpose({ show })
</script>

<style lang="less" scoped>
.progress {
  display: flex;
  justify-content: end;
  margin: 24px 0;
  margin-top: 0;
  font-weight: 400;
  font-size: 14px;
  color: #333333;

  .desc {
    font-weight: 400;
    font-size: 14px;
    color: #209EE4;

  }
}
</style>